import {Button, Form, Input, Select, Upload, Switch, DatePicker, Space, InputNumber} from "antd";
import API from "../../api/api";
import { UploadOutlined } from '@ant-design/icons';
import React, {useState} from "react";
import Edit from "../CKEditor/Edit";
import {config, url} from "../../util/config";

let token = localStorage.getItem("token")

export default function UpdateFormForNotice(props){
    const request = {
        action: url.file_upload_url,
        headers: {
            'Accept': "application/json",
            'Authorization': token
        },

        defaultFileList: []
    }
    let editorVisible = null;
    const [form] = Form.useForm();
    //文件上传默认显示的内容
    // let obj = {uid:1,status:"done",url:this.props.data.image_url}
    //是否执行了刷新
    let hasFlashed = false;

    const onReset = () => {
        console.log("reset")
        editorVisible = null
        form.resetFields();
    };

    const onFinish = (values) => {
        if(values.desc==""){
            values.desc=" "
        }
        console.log(values)
        if(values.new==defaultData.new && values.name==undefined && values.desc==undefined && values.status==undefined && values.attach==undefined && (editorVisible==null || editorVisible=="" || editorVisible=="<p></p>" || editorVisible==defaultData.content)){
            alert("无内容修改")
            return
        }else {
            //判断文章是不是有真正变动
            if(values.content=="" || values.content=="<p></p>" || values.content==defaultData.content){
                values.content = undefined
            }
            if(values.new==null || values.new==""){
                values.new = config.notify_date
            }
            //判断附件是不是有真正变动
            if(values.attach!=undefined){
                values.attachUrls = []
                values.attachNames = []
                values.attachNum = 0
                let tmpList = values.attach.fileList;
                for(let i=0;i<tmpList.length;i++){
                    values.attachUrls.push(tmpList[i].response.result[0].FILE_URL)
                    values.attachNames.push(tmpList[i].response.result[0].FILE_URL_NAME)
                    values.attachNum = values.attachUrls.length
                }
                if(values.attachUrls==defaultData.attachUrls && values.attachNames==defaultData.attachNames){
                    values.attachUrls = undefined
                    values.attachNames = undefined
                    values.attachNum = undefined
                }
            }
            values.key = defaultData.key;
        }
        console.log('Received values of form: ', values);
        if(values.status==true){
            values.status='Y'
        }else if(values.status==false){
            values.status='N'
        }
        if(API.updateNotice(values)=="ok"){
            if(!hasFlashed){
                //只有返回成功后，才会置父组件的状态值为true，即Modal关闭后实现列表刷新
                props.result(true)
                //执行上一步后，再本组件也加一个标记，来标识已经重置了父组件的刷新状态值status
                hasFlashed = true;
            }
        }
    };

    const defaultData = API.getNoticeContent(props.data.key);

    const getFileList=()=>{
        for(let i = 0;i<defaultData.attachNum;i++){
            request.defaultFileList.push({
                uid:i,
                name:defaultData.attachNames[i],
                status:'done',
                url:defaultData.attachUrls[i]
            })
        }
    }

    function getContent(content) {
        editorVisible = content
    }

    getFileList();

    return (
        <Form
            preserve={false}
            form={form}
            onFinish={onFinish}
            onReset={onReset}
            labelCol={{
                span: 4,
            }}
            wrapperCol={{
                span: 17,
            }}
            layout="horizontal"
            initialValues={{
                ['new']: defaultData.new
            }}
        >
            <Form.Item label="公告标题" name="name" >
                <Input defaultValue={defaultData.name}/>
            </Form.Item >
            <Form.Item label="公告描述" name={"desc"} >
                <Input defaultValue={defaultData.desc}/>
            </Form.Item>
            <Form.Item label="提醒時間【天數】" name="new">
                <InputNumber min={1} placeholder={`默認${config.notify_date}天`}/>
            </Form.Item>
            <Form.Item label="是否置顶" name={"status"} >
                <Switch defaultChecked={defaultData.status=='N'?false:true}/>
            </Form.Item>
            <Form.Item label="公告附件" name={"attach"} >
                <Upload name="file" {...request} listType="picture" onRemove={item=>{console.log("onRemove:",item)}}>
                    <Button icon={<UploadOutlined></UploadOutlined>}>上传</Button>
                </Upload>
            </Form.Item>
            <Form.Item
                name="content"
                label="活动内容"
            >
                {/*<Button onClick={_=>alert(editorVisible)}>获取文件内容</Button>*/}
                <Edit data={defaultData.content} onChange={getContent}></Edit>
            </Form.Item>

            {/*<RoleForm.Item label="是否启用" name={"moduleStart"} rules={[{ required: true }]}>*/}
            {/*    <Switch />*/}
            {/*</RoleForm.Item>*/}
            <Form.Item
                label="提交修改"
                name="commit"
            >
                <Button type="primary" htmlType="submit">
                    提交
                </Button>
                <Button htmlType="reset" style={{marginLeft:"1rem"}}>
                    重置
                </Button>
            </Form.Item>
        </Form>
    );
}
